<template>
	<div class="resale-components-container">
		<ul class="purchase-order-list" @click="toResaleShelves(item)" v-for="(item, index) in listData" :key="index">
		    <li>
				<p class="order-code">订单编号：{{item.outTradeNo}}</p>
				<div class="order-content">
					<div class="order-img">
						<img :src="item.smallPic" alt="">
					</div>
					<div class="order-text">
						<p class="pro-name">{{item.productName}}({{item.farmName}}）</p>
						<p class="pro-address"><span>养殖地：{{item.originProvince}}</span><span>牧场：{{item.farmName}}</span></p>
						<p class="pro-weight"><span>重量：{{item.productWeight}}/{{item.productWeightUnit}}</span><span>单价：{{item.salesPrice}}{{item.salesPriceUnit}}</span></p>
						<p class="pro-price"><span class="order-dete">剩余交货期：<i>{{item.deliveryMonth}}个月</i></span><span class="pro-c"><i>{{item.totalPrice}}</i>{{item.totalPriceUnit}}</span></p>
					</div>
				</div>
				<div class="pro-price-box">
					<span>转售数量：{{item.quantity}}头</span>
					<span>状态：{{item.state == '1' ? '已上架': '未上架'}}</span>
				</div>
				<div class="pro-btn">
					<van-button round class="u-bg-gradient-light order-status-btn">{{item.state == '1' ? '下架': '重新上架'}}</van-button>
				</div>
		    </li>
		</ul>
	</div>
</template>

<script>
	
	export default {
		props: {
			listData: Array,
		},
		data(){
			return {
				
			}
		},
		methods: {
			// 转售详情
			toResaleShelves(item){
				let idData = {
					productId: item.productId,  //  通过这id获取商品详情接口 /api/product/detail/{product_id}
					resaleId: item.id    // 下单的id
				}
				// 如果 状态为1，跳下架页面， 
				if(item.state == 1){
					this.$router.push({
						path: '/my/resale/resaleshelves/' + idData.productId,
						query: { item: JSON.stringify(idData) }
					})
				} else {
					// 去到上架页面
					this.$store.commit('totalWeight', item.productWeight)
					this.$store.commit('totalPrice', item.totalPrice)
					this.$router.push({
						path: '/my/resale/resaleshelvesup/' + item.id,
						query: { item: JSON.stringify(idData) }
					})
					
				}
				
			}	
		}
	}
	
</script>

<style lang="scss" scoped>
	@import "./tabs.scss";
	button{
		border: none;
	}
</style>
